<div class="ui-g">
  <div class="ui-g-3 monitor-leftmenu">
    <div class="monitor-date-time">
      <div class="monitor-date-date semi_arc e4">
        <div class="semi_arc_2 e4_1">
          <div class="counterspin4"></div>
        </div>
        <div style="font-size: 40px; margin-top: 25px;">{{date}}</div>
        <div style="font-size: 25px;">{{month}}月</div>
      </div>
      <div class="monitor-datetime-time arc e1">
        <div style="font-size: 23px; margin-left: -10px; margin-top: 23px;">{{hourMinutes}}</div>
        <div style="font-size: 15px; margin-left: 40px; margin-top: -30px; display; inline;">{{seconds}}</div>
        <div style="font-size: 17px; margin-top: 10px;">星期{{week}}</div>
      </div>
    </div>

    <p class="title">Performance</p>
    <div class="hline title_underline"></div>

    <span class="menuitem" style="font-size: 30px; margin-left: 10px;">
      <p id="cpu" class="caption" style="font-size: 20px;">CPU Usage: 19%</p>
    </span>
    <br/>

    <span class="menuitem entypo-chart-area" style="font-size: 30px; margin-left: 10px;">
      <p id="ram" class="caption" style="font-size: 20px;">Physical Memory: 28%</p>
    </span>
    <br/>

    <span class="menuitem entypo-chart-pie" style="font-size: 30px; margin-left: 10px;">
      <p id="proc" class="caption" style="font-size: 20px;">Processes: 73</p>
    </span>
    <p class="title" style="margin-top:80px;">Shortcuts</p>
    <div class="hline title_underline"></div>

    <div class="menu">
      <button class="menuitem">
        <span class="entypo-right-open" style="margin-left:10px;"></span>
        <p class="caption">User</p>
      </button>
      <button class="menuitem">
        <span class="entypo-right-open" style="margin-left:10px;"></span>
        <p class="caption">Documents</p>
      </button>
      <button class="menuitem">
        <span class="entypo-right-open" style="margin-left:10px;"></span>
        <p class="caption">Computer</p>
      </button>
      <button class="menuitem">
        <span class="entypo-right-open" style="margin-left:10px;"></span>
        <p class="caption">Control Panel</p>
      </button>
    </div>
    <div class="monitor-leftmenu-triangle">▶
      <br/>▶
      <br/>▶</div>
    <div class="monitor-leftmenu-line-one vline"></div>
    <div class="monitor-leftmenu-line-two vline"></div>
    <div class="monitor-leftmenu-line-three vline"></div>
    <div class="monitor-leftmenu-line-four vline"></div>
    <div class="monitor-leftmenu-line-five vline"></div>
    <div class="monitor-leftmenu-line-six vline"></div>
    <div class="monitor-leftmenu-line-seven vline"></div>

    <canvas id="particle1" width="20" height="500"></canvas>
    <canvas id="particle1_1" width="40" height="510"></canvas>
    <canvas id="particle1_2" width="40" height="510"></canvas>
  </div>
  <div class="ui-g-6">
    <div id="arc_container">
      <div class="arc_reactor">
        <div class="case_container">
          <div class="e7">
            <div class="semi_arc_3 e5_1">
              <div class="semi_arc_3 e5_2">
                <div class="semi_arc_3 e5_3">
                  <div class="semi_arc_3 e5_4"></div>
                </div>
              </div>
            </div>
            <div class="core2"></div>
          </div>
          <ul class="marks">
            <li></li>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
          </ul>
        </div>
      </div>
    </div>
  </div>
  <div class="ui-g-3">
    <!-- Right Menu -->
    <div id="rightmenu">
      <p class="title" style="text-align: left; margin-left: 10px;">Notes</p>
      <div id="particle10" class="hline"></div>
      <div id="particle11" class="hline"></div>
      <div id="particle12" class="vline"></div>
      <textarea id="note_input" cols="44">For the maximum viewing experience, please view this pen in full screen where the code is displayed to the side of the display.
      
      To Complete:
      - Right Menu (this side of the screen)
        - Make this note restricted to 11 rows
        - Fill in empty space below
      - Weather widget next to date/time
      - Place quick access taskbar down bottom
      - Fill in space at the top</textarea>
    </div>
  </div>
</div>